<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>login</title>

    <script src="https://cdn.bootcss.com/jquery/2.2.4/jquery.min.js"></script>
    <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>



</head>
<style type="text/css">
	html{
		padding: 0;
		margin: 0;
	 height: 100%; 
	}
	body{
		height: 100%;
	    background: url("images/640.webp") no-repeat;
		background-size: cover;
	    animation-duration:12s;
	}
	@keyframes myfirst
	{
	    0%   {background:url("images/640.webp");}
	    34%  {background:url("images/640.webp");}
	    67%  {background:url("images/640.webp");}
	    100% {background:url("images/640.webp");}
	}
	.form{background: rgba(255,255,255,0.2);width:400px;margin:120px auto;}
	/*阴影*/
	.fa{display: inline-block;top: 27px;left: 6px;position: relative;color: #ccc;}
	input[type="text"],input[type="password"]{padding-left:26px;}
	.checkbox{padding-left:21px;}
</style>
<body>
    <div class="container">
        <div class="form row">
            <div class="form-horizontal col-md-offset-3" id="login_form">
                <h3 class="form-title">用户注册</h3>
                <div class="col-md-9">
                    <div class="form-group">
                        <i class="fa fa-user fa-lg"></i>
                        <input class="form-control required" type="text" placeholder="Username" id="username" name="username" autofocus="autofocus" maxlength="20" required="required"/>
                    </div>
                    <div class="form-group">
                            <i class="fa fa-lock fa-lg"></i>
                            <input class="form-control required" type="password" placeholder="Password" id="password" name="password" maxlength="8" required="required"/>
                    </div>
					<div class="form-group">
					        <i class="fa fa-lock fa-lg"></i>
					        <input class="form-control required" type="password" placeholder="ConfirmPassword" id="confirm" name="Password" maxlength="8" required="required"/>
					</div>
                    <div class="form-group" style="margin: 0;padding: 0;">
                        <button type="submit" class="btn btn-success text-center" name="submit" id="register" style="margin-left: 60px;margin-bottom: 20px;">注册</button>
                    </div>
					<div class="text" style="color: red;"></div>
                </div>
            </div>
        </div>
    </div>
</body>
</html>
<script type="text/javascript">
	function ajax(){
					$.ajax({
						type: "get",//发送请求的类型post，get
						dataType: "json",//默认是text
						url: `http://127.0.0.1:7300/mock/5ee96c5cc5fadd342c8a0931/totalData/getRegister`,//发送的地址
						success: function (msg) {//成功的回调
						var data=msg
						
						$('#register').click(function(){
							let username=$('#username').val()
							let password=$('#password').val()
							let password2=$('#confirm').val()
							
							if(username!=''&&password!=''&&password2!=''){
							if(data.status){
								if(password!=password2){
									alert('两次密码不一致')
								}else{
									alert('注册成功')
									$('.text').html('注册成功'+'&nbsp&nbsp&nbsp<a href="login.html">返回登陆界面</a>')
								}
								
							}
							}else{
								alert('您还有信息未填写')
							}
								
								
							})
							
						
						
		
		
			
		
		
		
							
						},
						error: function (error) {
							console.log(error.responseText);
						}
					});
				}
	     
					ajax();
</script>